import { EventNames } from "./consts/EventNames";
import EventBus from "./core/EventBus";
import Utils from "./Utils";

declare var XML: any;
interface MyFloatyWindow {
    txtJob: any;
    txtStatus: any;
}
export default class GameStatusBar {
    private readonly WID: number = 360;
    private readonly HEI: number = 35;

    private floatyWindow: floaty.FloatyWindow & MyFloatyWindow;

    constructor() {
        let w = this.floatyWindow = <floaty.FloatyWindow & MyFloatyWindow>floaty.rawWindow(
            new XML(`<frame gravity="center" bg="#77999999" w="${this.WID}px" h="${this.HEI}px" paddingLeft="10px">
                <horizontal>
                <text id="txtJob" layout_weight="1"></text>
                <text id="txtStatus" layout_weight="1"></text>
                </horizontal>
            </frame>`)
        );
        w.setPosition(device.width - this.WID, device.height - this.HEI);
        w.exitOnClose();

        w.txtJob.click(() => {
            EventBus.emit(EventNames.SHOW_MENU_DIALOG);
        });

        EventBus.on(EventNames.UPDATE_JOB_TEXT, (txt: string, txtColor: number) => {
            this.setText(this.floatyWindow.txtJob, `[${txt}]`, txtColor || colors.argb(255, 225, 138, 2));
        });

        EventBus.on(EventNames.UPDATE_STATUS_TEXT, (txt: string, txtColor: number) => {
            this.setText(this.floatyWindow.txtStatus, txt, txtColor);
        });
    }

    private setText(component: any, txt: string, txtColor: number = colors.argb(255, 0, 255, 0)): void {
        ui.run(() => {
            component.setText(txt);
            component.setTextColor(txtColor);
        });
    }

    public onExit() {
        this.floatyWindow.close();
    }

}